<template>
  <div class="common-pd-page people-basic-info">
    <HPModuleTitle :titleText="'基本信息'" />
    <ul class="detail-info-box bd" v-if="infoData">
      <li v-for="item in baseInfolist" :key="item.key" class="info-item" :class="item.flex? 'flex-100': ''">
        <span class="info-item-tip">
          {{ item.label }}
        </span>
        ：
        <span v-if="!item.file" class="info-item-txt" >
          {{
            item.icon
              ? infoData[item.key]
                ? `${item.icon}${infoData[item.key]}`
                : ""
              : infoData[item.key]
          }}
        </span>
        <span v-else class="info-item-txt file-item">
          <span
            v-for="it in infoData[item.key]"
            :key="it.id"
            @click="showFile(it.fileUrl)"
            >{{ it.fileName }}</span
          >
        </span>
      </li>
    </ul>
    <HPModuleTitle :titleText="'账号信息'" />
    <ul class="detail-info-box bd" v-if="infoData">
      <li v-for="item in accountInfoList" :key="item.key" class="info-item">
        <span class="info-item-tip">
          {{ item.label }}
        </span>
        ：
        <span class="info-item-txt">
          {{
            item.icon
              ? infoData[item.key]
                ? `${item.icon}${infoData[item.key]}`
                : ""
              : infoData[item.key]
          }}
        </span>
      </li>
    </ul>
    <HPModuleTitle :titleText="'工作信息'" />
    <ul class="detail-info-box bd" v-if="infoData">
      <li v-for="item in workInfoList" :key="item.key" class="info-item" :class="item.flex? 'flex-100': ''">
        <span class="info-item-tip">
          {{ item.label }}
        </span>
        ：
        <span v-if="!item.file" class="info-item-txt">
          {{
            item.icon
              ? infoData[item.key]
                ? `${item.icon}${infoData[item.key]}`
                : ""
              : infoData[item.key]
          }}
        </span>
        <span v-else class="info-item-txt file-item">
          <span
            v-for="it in infoData[item.key]"
            :key="it.id"
            @click="showFile(it.fileUrl)"
            >{{ it.fileName }}</span
          >
        </span>
      </li>
    </ul>
  </div>
</template>
<script>
import HPModuleTitle from "@/components/HPModuleTitle.vue";
import { outsourcerExport } from "@/fetch/modules/peopleInfo";
export default {
  props: {
    candidateInfo: {
      type: Object,
      default: {},
    },
    isShowCandidate: {
      type: Boolean,
      default: false,
    },
  },
  created() {
    this.fetchData()
  },
  data() {
    return {
      list: [
        {
          label: "拼音",
          key: "english",
        },
        // {
        //   label: "确认已开启BHR账号",
        //   key: "bhrAccount",
        // },
        // {
        //   label: "确认已开启OA账号",
        //   key: "oaAccount",
        // },
        // {
        //   label: "确认已添加Flow账号",
        //   key: "flowAccount",
        // },
        // {
        //   label: "确认已开启账号匹配",
        //   key: "accountMatching",
        // },
      ],
      baseInfolist: [
        {
          label: "姓名",
          key: "userName",
        },
        {
          label: "性别",
          key: "gender",
        },
        {
          label: "学历",
          key: "education",
        },
        {
          label: "工作经验(年)",
          key: "workExperience",
        },
        {
          label: "证件类型",
          key: "certificateType",
        },
        {
          label: "证件号码",
          key: "certificateCode",
        },
        {
          label: "区号",
          key: "countryCode",
          icon: "+",
        },
        {
          label: "手机号码",
          key: "phone",
        },
        {
          label: "一寸免冠照",
          key: "photoList",
          file: true,
          flex: 1,
        },
        {
          label: "户籍地址",
          key: "registerPlace",
          flex: 1,
        },
        {
          label: "现住地址",
          key: "residentPlace",
          flex: 1,
        },
      ],
      accountInfoList: [
        {
          label: "外包工号",
          key: "workCode",
        },
      ],
      workInfoList: [
        {
          label: "入场日期",
          key: "entryDate",
        },
        {
          label: "工作地点",
          key: "workingPlace",
        },
        {
          label: "月薪（元）",
          key: "monthlyPay",
        },
        {
          label: "岗位报价",
          key: "quotation",
        },
        {
          label: "考勤工时制",
          key: "workTimeType",
        }, 
        {
          label: "外包类型",
          key: "userSonGroup",
        },
        {
          label: "结算方式",
          key: "settName",
        },
        {
          label: "所在部门",
          key: "deptName",
        },
        {
          label: "外包人员汇报对象",
          key: "managerNickName",
        },
        {
          label: "职位名称",
          key: "positionName",
        },
      ],
      infoData: {}
    };
  },
  methods: {
    // 预览文件
    showFile(fileUrl) {
      let aDom = document.createElement("a");
      aDom.target = "_blank";
      const { protocol, hostname } = window.location;
      const baseUrl = `${protocol}//${hostname}/`;
      aDom.href = baseUrl + fileUrl;
      aDom.style.display = "none";
      document.body.appendChild(aDom);
      setTimeout(() => {
        aDom.click();
      }, 200);
      setTimeout(() => {
        document.body.removeChild(aDom);
      }, 500);
    },
    async fetchData () {
      const { wc } = this.$route.query;
      const { data } = await outsourcerExport({
        workCode: wc,
        export: false
      });
      if (data.state === "0000") {
        const infos = data.data[0]
        this.infoData = {
          ...infos,
          managerNickName: `${ infos.managerNickName }(${ infos.managerWorkCode })`,
          photoList: infos.admitFileList && infos.admitFileList.filter(item => { return item.fileMold === 1 }),
          fileList: infos.admitFileList && infos.admitFileList.filter(item => { return item.fileMold === 2 }),
        }
      }
    }
  },
  components: {
    HPModuleTitle,
  },
};
</script>
<style lang="scss">
@import "~@/assets/scss/mixins.scss";
@include Detail-Info;
.people-basic-info {
  .file-item {
    color: #00a1d6;
    cursor: pointer;
    >span {
      padding-right: 10px;
    }
  }
  .info-item-tip {
    width: 140px;
  }
  .detail-info-box {
    margin-bottom: 20px;
  }
  .flex-100 {
    flex: 100% !important;
  }
}
</style>
